spb/websensor

1import { Skeleton, SkeletonPanel, SkeletonRows } from "@/components/ui";23export default function Loading() {4  return (5    <>6      <div className="mb-3 flex flex-wrap items-end justify-between gap-3">7        <div className="flex min-w-0 flex-col gap-2">8          <div className="flex items-center gap-2">9            <Skeleton className="h-4 w-20" />10            <Skeleton className="h-4 w-24" />11            <Skeleton className="h-4 w-16" />12          </div>13          <Skeleton className="h-6 w-[28rem] max-w-full" />14          <Skeleton className="h-3 w-80 max-w-full" />15        </div>16        <div className="flex gap-2">17          <Skeleton className="h-7 w-20" />18          <Skeleton className="h-7 w-28" />19        </div>20      </div>21      <Skeleton className="mb-3 h-3 w-96 max-w-full" />22      <div className="mb-4 grid grid-cols-2 gap-px overflow-hidden rounded-lg border border-line bg-line sm:grid-cols-4">23        {Array.from({ length: 4 }, (_, i) => (24          <div key={i} className="flex flex-col gap-1.5 bg-panel px-3 py-2">25            <Skeleton className="h-2.5 w-16" />26            <Skeleton className="h-5 w-12" />27            <Skeleton className="h-2.5 w-24" />28          </div>29        ))}30      </div>31      <div className="grid gap-4 xl:grid-cols-[1fr_340px]">32        <div className="flex flex-col gap-4">33          <div className="panel">34            <div className="border-b border-line px-3 py-2"><Skeleton className="h-2.5 w-40" /></div>35            <SkeletonRows rows={6} />36          </div>37          <div className="panel">38            <div className="border-b border-line px-3 py-2"><Skeleton className="h-2.5 w-20" /></div>39            <SkeletonRows rows={6} />40          </div>41        </div>42        <aside className="flex flex-col gap-4">43          <SkeletonPanel lines={2} />44          <SkeletonPanel lines={6} />45          <SkeletonPanel lines={4} />46        </aside>47      </div>48    </>49  );50}51